<!-- Please remove this file from your project -->
<template>
  <!-- <div class="relative flex items-top justify-center min-h-screen bg-gray-100 sm:items-center sm:pt-0"> -->
  <div class="headbox">
    <div class="headbox_item">
      <img class="logoimg" src="../assets/logo.jpg" alt="">
      <div class="headright">
        <div class="pointer" @click="changepage(index)" :class="current == index ? 'active' : ''"
          v-for="(i, index) in headlist">
          {{ i }}
        </div>
        <div class="flex-a-c pointer" >
          <img style="width: 18px; height: 18px;" src="../assets/lan.jpg" alt="" />
          <el-dropdown trigger="click" @command='drawclick' >
            <span class="el-dropdown-link">
              {{languag}}<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="ch" >中文</el-dropdown-item>
              <el-dropdown-item command="en">英文</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
  </div>

</template>

<script>
export default {
  name: 'Nuxtmyhead',
  data() {
    return {
      headlist: ['主页', '博主入驻', '商家入驻', '达人入驻', '加入我们', '我们的优势'],
      current: 0,
      languag:'中文'
    }
  },
  methods: {
    changepage(index) {
      this.current = index
      this.$emit('changecurrent',this.current)
    },
    drawclick(command){
      localStorage.setItem('lang',command)
      this.$cookies.set('token', 1333)
      this.$cookies.set('lang', command)
      console.log(this.$cookies.get("lang"));
      // this.$cookies.remove('token')
    },
  }

}
</script>
<style>
.headbox {
  width: 100vw;
  background-color: #fff;
  box-sizing: border-box;
}

.headbox_item {
  padding: 20px 0;
  margin: 0 auto;
  width: 1440px;
  display: flex;
  justify-content: space-between;
}

.logoimg {
  width: 284px;
  height: 15px;
}

.headright {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 850px;
}

.active {
  color: #F83A3A;
}
</style>
